DHTML JavaScript Tree samples

Add / Delete items

You can freely customize a tree view. This sample illustrates that the tree items can be easily added/deleted dynamically through the graphical user interface. You can insert new item after the selected node or as its child. This feature allows you to configure a DHTML tree menu effortlessly.

	Insert new child item Item label Insert new item next Item label Delete item

<div id="treeboxbox_tree" style="width:200;height:200"></div> <script> tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0); tree.setImagePath("../imgs/"); tree.loadXML("tree.xml") tree.insertNewItem(0,100,"New Node 1",0,0,0,0,"SELECT"); tree.insertNewNext(2,101,"New Node 2",0,0,0,0,""); tree.deleteItem("2"); </script>

0s passed to the function for arguments 4-7 (function to call on select, images) mean use default values for them

Last argument is a comma delimited string of following possible value (upper case only):

SELECT - move selection to this node after inserting

CALL - call function on select

TOP - add node to the top position

CHILD - node has children

CHECKED - checkbox is checked (if exists)

Go to the dhtmlxTree main page or Close this page